<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <meta name="viewport"
          content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
    <title>百度地图</title>
    <style>
        html, body {
            width: 100%;
            height: 100%;
            padding: 0;
            margin: 0;
        }

        #mapDiv {
            width: 100%;
            height: 100%;
        }
    </style>
</head>
<body>

<!--地图区域-->
<div id="mapDiv">地图加载中...</div>

<script src="http://api.map.baidu.com/api?v=2.0&ak=3ePu9mcalC9yQuAihz9MbwGYmBnTVOdG&callback=myBMapInitialize"
        type="text/javascript"></script>
<script type="text/javascript">
    var myBMap; //定义地图变量，在当前页作为全局变量
    /**
     * 加载完百度地图sdk的回调，地图初始化
     */
    function myBMapInitialize() {
        var geolocation = new BMap.Geolocation();
        document.getElementById("mapDiv").innerHTML = "正在获取您的位置...";
        geolocation.getCurrentPosition(function (r) {
            if (this.getStatus() == BMAP_STATUS_SUCCESS) {
                myBMap = new BMap.Map('mapDiv');
                myBMap.centerAndZoom(r.point, 15);
                var mk = new BMap.Marker(r.point);
                myBMap.addOverlay(mk);
                myBMap.addControl(new BMap.NavigationControl());
                myBMap.addControl(new BMap.ScaleControl());
                myBMap.addControl(new BMap.OverviewMapControl());
                myBMap.addControl(new BMap.GeolocationControl());
                myBMap.addControl(new BMap.MapTypeControl());
                myBMap.setCurrentCity("南京"); // 仅当设置城市信息时，MapTypeControl的切换功能才能可用
                console.log('您的位置：' + r.point.lng + ',' + r.point.lat);


                driveRoute(r.point, '南京南站', 0);

            }
            else {
                console.log('failed' + this.getStatus());
            }
        }, {enableHighAccuracy: true})
    }


    /**
     * 驾车导航
     * @param start 起点名称或百度坐标
     * @param end 终点名称或百度坐标
     * @param route 路线类型 0>最少时间;1>最短距离;2>避开高速
     */
    function driveRoute(start, end, route) {
        var start = start
                , end = end, route = route;
        myBMap.clearOverlays();
        var driving = new BMap.DrivingRoute(myBMap, {
            renderOptions: {map: myBMap, autoViewport: true},
            policy: route
        });
        driving.search(start, end);
    }
</script>
</body>
</html>